<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Getting Started: Serving Web Content</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script src="http://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script>
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.12.1/themes/dark-hive/jquery-ui.css"/>
    <link rel="stylesheet" type="text/css" href="/css/skill/main.css"/>
    <script type="text/javascript" src="/js/skill/main.js"></script>
    <style>
    </style>
    <script type="text/javascript">

    /**
     * 根据技能水平，获取进度条的背景色。
     */
    function getLevelColor(level) {
        switch(parseInt(level / 10)) {
        case 0:
        case 1:
        case 2:
        case 3:
        case 4:
        case 5:
        case 6:
        case 7:
        case 8:
        case 9:
        case 10:
        }
    }
    </script>
</head>
<body style="">
    <div class="container" style="">
        <div style="padding-bottom: 12px; font-size: 20">技能列表</div>
        <div class="content">
            <div id="skills">
                <div class="skill" th:each="skill : ${skills}">
                    <div class="skill_name"><label class="skill_name" th:attr="data-value=${skill.name}" th:text="${skill.name}">空白</label></div>
                    <div th:attr="data-value=${skill.level}" class="peter_progressbar">
                        <div class="progress-label"></div>
                    </div>
                    <span class="target" th:text="${skill.target}">目标</span>
                    <span class="weight" th:text="${skill.weight}">权重</span>
                <span class="heart-container ui-state-default ui-corner-all"><span th:if="${skill.favorite} == 1" class="ui-icon ui-icon-heart"></span></span>
                    <input type="button" class="peter-btn" value="更新" th:attr="data-key=${skill.id}" style="box-sizing: border-box; width: 50px; height: 20px; vertical-align: middle; padding: 2px 4px; font-size: 10px;"/>
                </div>
            </div>
            <div id="new">
                <div class="skill_name"><input id="new-name" class="skill_name" placeholder="技能名"/></div>
                <div data-value="55" class="peter_progressbar">
                    <div class="progress-label"></div>
                </div>
                <input class="peter_spinner" name="target"/>
                <input class="peter_spinner" name="weight"/>
                <span class="heart-container"><span class="ui-icon ui-icon-heart"></span></span>
                <input id="addBtn" type="button" class="peter-btn" value="添加" style="box-sizing: border-box; width: 50px; height: 20px; vertical-align: middle; padding: 2px 4px; font-size: 10px;"/>
            </div>
        </div>
        <div class="desc">
            <p>技能级别</p>
            <ul>
                <li><span class="indent">0.</span>不熟悉这个领域</li>
                <li><span class="indent">1.</span>你能够阅读/理解这个领域最基本的知识</li>
                <li><span class="indent">2.</span>实现小变化的能力，了解基本原理，并能够快速的找到帮助信息（以最少的帮助找出更多的细节）</li>
                <li><span class="indent">3.</span>基本上熟练掌握的这个领域，不再依赖帮助文档</li>
                <li><span class="indent">4.</span>您对主题领域以及所有日常工作感到满意：对于软件领域 - 使用所有基本语言功能开发中等程序的能力（不包括书本），对其更深奥特征有认识（附带书籍）。 对于系统领域 - 了解网络和系统管理的许多基础知识，能够依赖于掌握的知识运行一个小系统网络，包括的恢复，调试和非平凡故障排除。</li>
                <li><span class="indent">5.</span>对参考资料的依赖程度更低，对技术领域或特定领域的技术更加深入。</li>
                <li><span class="indent">6.</span>从头开发大型程序和系统的能力。 了解低级别的细节和内部。 能够从头开始设计/部署大多数大型分布式系统</li>
                <li><span class="indent">7.</span>您了解并使用大多数较罕见的语言特性、技术和相关的内部信息。 能够自动化大量的系统管理。</li>
                <li><span class="indent">8.</span>对罕见案件、深奥的特征、协议和系统有着深刻的理解，也包括“操作手册”。具有设计、部署和主持非常关键或大型的基础设施的实际经历，并建立的相应的自动化</li>
                <li><span class="indent">9.</span>在这个领域具备了出书能力（但还没有这样做）; 与标准委员会合作确定新的标准和方法。</li>
                <li><span class="indent">10.</span>在这个领域已经出版了一本书。成为这一领域公认的专家。</li>
            </ul>
        </div>
        <div class="desc">
            <p>Google评分卡原文</p>
            <ul>
                <li><span class="indent">0.</span>You are unfamiliar with the subject area.</li>
                <li><span class="indent">1.</span>You can read / understand the most fundamental aspects of the subject area.</li>
                <li><span class="indent">2.</span>ability to implement small changes, understand basic principles and able to figure out additional details with minimal help</li>
                <li><span class="indent">3.</span>basic proficiency in a subject area without relying on help.</li>
                <li><span class="indent">4.</span>You are comfortable with the subject area and all routine work on it: For software areas - ability to develop medium programs using all basic language features w/o book, awareness of more esoteric features(with book). For systems areas - understanding of many fundamentals of networking and systems administration, ability to run a small network of systems including recovery, debugging and nontrivial troubleshooting that relies on the knowledge of internals.</li>
                <li><span class="indent">5.</span>An even lower degree of reliance on reference materials. Deeper skills in a field or specific technology in the subject area.</li>
                <li><span class="indent">6.</span>Ability to develop large programs and systems from scratch. Understanding of low level details and internals. Ability to design/deploy most large, distributed systems from scratch.</li>
                <li><span class="indent">7.</span>You understand and make use of most lesser known language features, technologies, and associated internals. Ability to automate significant amounts of systems administration.</li>
                <li><span class="indent">8.</span>Deep understanding of corner cases, esoteric features, protocols and systems including "theory of operation". Demonstrated ability to design, deploy and own very critical or large infrastructure, build accompanying automation.</li>
                <li><span class="indent">9.</span>Could have written the book about the subject area but didn't; works with standards committees on defining new standards and methodologies.</li>
                <li><span class="indent">10.</span>Wrote the book on the subject area(there actually has to be a book). Recognized industry expert in the field, might have invented it.</li>
            </ul>
            <p>Subject Areas</p>
            <ul>
                <li>TCP/IP Networking (OSI stack, DNS etc)</li>
                <li>Unix/Linux internals</li>
                <li>Unix/Linux Systems administration</li>
                <li>Algorithms and Data Structures</li>
                <li>C/C++/Python/Java/Perl/Go</li>
                <li>shell Scriptiong(sh, Bash, ksh, csh)</li>
                <li>SQL and/or Database Admin</li>
                <li>Scriptiong language of your choice(not already mentioned)</li>
                <li>People Management</li>
                <li>project Management</li>
            </ul>
        </div>
    </div>
</body>
</html>
